<template>
  <div>
    <h2>作业3</h2>
    <input type="text" v-model.number="num1" />
    <select name="" id="" v-model="sel">
      <option value="+">+</option>
      <option value="-">-</option>
      <option value="*">*</option>
      <option value="/">/</option>
    </select>
    <input type="text" v-model.number="num2" />
    <button @click="handler">=</button>
    <span>{{ result }}</span>
  </div>
</template>
<script>
export default {
  data() {
    return {
      num1: 0,
      num2: 0,
      sel: "+",
      result: "",
    };
  },
  methods: {
    handler() {
      switch (this.sel) {
        case "+":
          this.result = this.num1 + this.num2;

          break;
        case "-":
          this.result = this.num1 - this.num2;

          break;
        case "*":
          this.result = this.num1 * this.num2;

          break;
        case "/":
          this.result = this.num1 / this.num2;

          break;

        default:
          break;
      }
    },
  },
};
</script>
<style lang="scss"></style>
